<template>
  <!--  入库任务-->
  <div class="zy-content">
    <div class="searchBox search-box-layout">
      <search :columns="searchData" @getSearch="getSearch(arguments)"></search>
    </div>
    <div class="list-layout mt16">
      <div class="btns clear">
        <span class="title">{{ $t("common.listInformation") }}</span>
        <!--        <Button @click="handleAdd"> 新增 </Button>-->
        <!-- <Button @click="handleImportData">
                    批量导入
                </Button> -->
        <!-- <Button @click="downloadTemplate"> 导出 </Button> -->
      </div>
      <div class="tableContent" :style="{ height: tableHeight + 'px' }">
        <Table
            :columns="columns"
            ref="selection"
            border
            :data="list"
            :height="tableHeight"
        >
          <template slot-scope="{ row }" slot="action">
            <span class="operationBtn" @click="handleEditRow(row)"
            ><i class="iconfont zy-common-bianji"></i>入库确认</span
            >

            <span class="operationBtn" @click="handleDeleteRow(row)"
            ><i class="iconfont zy-common-shibai"></i>驳回</span
            >
          </template>
        </Table>
      </div>
      <div class="pageWrap mt16">
        <pageLeftTitle :total="total"/>
        <Page
            :total="total"
            :page-size="params.pageSize"
            :current="params.current"
            @on-change="changePageNum"
            @on-page-size-change="changePageSize"
            show-sizer
        />
      </div>
    </div>

    <Modal
        :mask-closable="false"
        v-model="rejectShow"
        title="驳回"
        class="modal-title-layout"
    >
      <Form ref="form" class="formList">
        <FormItem label="驳回原因">
          <Input v-model="rejectValue" placeholder="请输入驳回原因" clearable/>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="default" @click="rejectShow = false">取消</Button>
        <Button type="primary" @click="handleDeleteSure">确定</Button>
      </div>
    </Modal>

    <importExcelModal
        :importExcelStateF="importExcelState"
        v-if="importExcelState"
        @importExcelChange="importExcelChange"
    >
    </importExcelModal>
  </div>
</template>

<script>
import ImportExcelModal from "@/components/importExcel.vue";
import fileDownload from "js-file-download";
import search from "@/components/curd/searchList.vue";
import toggleTableOperation from "@/mixins/toggleTableOperation";

export default {
  name: "inventoryDetail",
  components: {ImportExcelModal, search},
  mixins: [toggleTableOperation],
  data() {
    return {
      rejectValue: null,//驳回
      params: {
        pageSize: 20,
        current: 1,
      },
      searchData: [
        {
          title: "储位名称",
          key: "storageId",
          type: 'wareStorage',
          dicData: []
        },
        {
          title: "物料名称",
          key: "materialId",
          type: 'select',
          params: {
            label: "label",
            value: "value",
          }
        },
      ],
      columns: [
        {
          title: '序号',
          width: 80,
          align: 'center',
          render: (h, params) => {
            return h('span', params.index + (this.params.current - 1) * this.params.pageSize + 1);
          },
        },
        {
          title: "任务号",
          key: "taskNo",
          align: "center",
          resizable: true,
          minWidth: 150,
        },
        {
          title: "单据号",
          key: "orderNo",
          minWidth: 150,
          align: "center",
          resizable: true,
        },

        {
          title: "物料",
          key: "materialName",
          align: "center",
          minWidth: 150,
          resizable: true,
        },
        {
          title: "数量",
          key: "materialCount",
          align: "center",
          minWidth: 100,
          resizable: true,
        },
        {
          title: "业务类型",
          key: "transferType",
          align: "center",
          minWidth: 150,
          resizable: true,
          render: (h, params) => {
            const typeMap = {
              transfer: '调拔',
              instock: '入库',
              outstock: '出库',
              pick: '备料'
            };
            return h('div', typeMap[params.row.transferType]);
          }
        },
        {
          title: "目标仓位",
          key: "targetWareName",
          align: "center",
          minWidth: 150,
          resizable: true,
        },
        {
          title: "目标储位",
          key: "targetStorageName",
          align: "center",
          minWidth: 150,
          resizable: true,
        },
        {
          title: "创建时间",
          key: "createTime",
          minWidth: 210,
          align: "center",
          resizable: true,
        },
        {
          title: '操作',
          slot: 'action',
          fixed: 'right',
          width: 210,
          minWidth: 150,
          align: 'center'
        }
      ],
      importExcelState: false,
      list: [],
      total: 0,
      rejectShow: false,
      currentItem: {},
      createStatus: false,
      form: {},
      nameList: [],
      searchParams: {},
      typeList: [
        {label: "自制", value: "0"},
        {label: "内购", value: "1"},
        {label: "外购", value: "2"},
        {label: "租赁", value: "3"},
        {label: "客供", value: "4"},
      ],
    };
  },
  computed: {
    tableHeight() {
      return window.innerHeight - 400;
    }
    ,
  }
  ,

  mounted() {
    this.getList();
    this.getSearchList()
  }
  ,
  methods: {
    async getList() {

      try {
        const response = await this.axios.post(
            "/api /warehouseMaterialTransferTask/pageByPojo",
            {...this.params, ...this.searchParams, ...{status: 2}}//入库任务写死
            // {
            //   1 新建
            //   2 执行中
            //   3 完结
            // }
        );
        if (response.code === 200) {
          console.log(response.data, "response.data.records");
          this.list = response.data.records;
          this.total = response.data.total;
        } else {
          this.$Message.warning(response.msg);
        }
      } catch (error) {
        console.error(error);
        this.$Message.error("获取列表失败");
      }
    }
    ,
    getSearchList() {
      this.axios
          .get("/api/basedataWarehouse/queryAll", {}).then(res => {
        if (res.code == 200) {
          const list = res.data
          for (const item of list) {
            item.options = item.storageVOList
            item.value = item.id
            item.label = item.warehouseName
// 改造成上下级
            if (item.storageVOList && item.storageVOList.length > 0)
              for (const items of item.storageVOList) {
                items.options = items.storageName
                items.value = items.id
                items.label = items.storageName
              }
          }
          this.searchData[0].dicData = list
        }
      })

      this.axios
          .post("/api/basedataMaterial/getAll", {}).then(res => {
        if (res.code == 200) {
          const list = res.data
          const loop = []
          for (const item of list) {
            loop.push(
                {
                  value: item.id,
                  label: item.materialName
                }
            )
          }
          this.searchData[1].dicData = loop;
        }
      })
    }
    ,
    closeSubmit() {
      this.createStatus = false;
    }
    ,
    getSearch(arg) {
      this.searchParams = arg[0] || {};
      this.getList();
    }
    ,

    importExcelChange(val) {
      this.importExcelState = false;
      if (val === "success") {
        this.$Message.success("导入成功!");
        this.changeNum();
      }
    }
    ,

    reset() {
      this.params = {pageSize: 20, current: 1};
      this.getList();
    }
    ,
    changeNum() {
      this.params.current = 1;
      this.params.pageSize = 20;
      this.getList();
    }
    ,
    handleAdd() {
      this.form = {};
      this.createStatus = true;
    }
    ,
    // downloadTemplate() {
    //   const filName = "物料管理导出文档";
    //   this.axios
    //     .get("/api/basedataMaterial/exportExcel", { responseType: "blob" })
    //     .then((res) => {
    //       if (res.code === 200) {
    //         fileDownload(res, `${filName}.xlsx`);
    //       } else {
    //         this.$Message.warning("导出失败");
    //       }
    //     });
    // },
    handleImportData() {
      this.importExcelState = true;
    }
    ,
    handleAddSubmit() {
      if (this.form.id) {
        this.axios
            .put("/api/basedataEquipment/update", this.form)
            .then((res) => {
              this.currentItem = {};
              this.createStatus = false;
              this.getList();
            })
            .catch((error) => {
              console.error("Error submitting form:", error);
            });
      } else {
        this.axios
            .post("/api/basedataEquipment/save", this.form)
            .then((res) => {
              this.currentItem = {};
              this.createStatus = false;
              this.getList();
            })
            .catch((error) => {
              console.error("Error submitting form:", error);
            });
      }
    }
    ,
    handleEditRow(row) {
      this.$confirm('是否确认入库?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        const param = {
          id: row.materialTransferOrderId,
          code: row.orderNo,
          details: [row],
          tasks: [row]
        }
        this.axios
            .post("/api/warehouseMaterialTransferOrder/inStock", param).then(res => {
          if (res.code !== 200) {
            this.$Message.error(res.message);
            return false
          }
          this.$Message.message('确认成功');
          this.getList()
        })
      })
      // this.$Modal.confirm({
      //   title: '确认入库',
      //   content: '<p>是否确认入库?</p>',
      //   onOk: () => {
      //     this.axios
      //         .post("/api/warehouseMaterialTransferOrder/inStock", param).then(res => {
      //       if (res.code !== 200) {
      //         this.$Message.error(res.message);
      //         return false
      //       }
      //       this.$Message.message('确认成功');
      //       this.getList()
      //     })
      //   }
      // });
    }
    ,
    handleDeleteRow(row) {
      this.currentItem = row;
      this.rejectShow = true;
    }
    ,
    handleDeleteSure() {
      const row = this.currentItem
      row.remark = this.rejectValue
      const param = {
        id: row.materialTransferOrderId,
        code: row.orderNo,
        details: [row],
        tasks: [row]
      }
      this.axios({
        method: "post",
        url: "/api/warehouseMaterialTransferOrder/reject",
        data: param,
      }).then((res) => {
        if (res.code === 200) {
          this.currentItem = {};
          this.rejectValue = null;
          this.rejectShow = false;
          this.getList();
        } else {
          this.$Message.warning(res.message);
        }
      });
    }
    ,
    changePageNum(val) {
      this.params.current = val;
      this.getList();
    }
    ,
    changePageSize(val) {
      this.params.pageSize = val;
      this.getList();
    }
    ,
  }
  ,
};
</script>

<style scoped>
.tableContent {
}
</style>
